<template>
  <div class='u-staffsDialog'>
    <el-dialog ref='dialog'
      title="选择销售"
      :visible.sync="dialogVisible"
      :before-close="() => {this.dialogVisible = false}"
    >
      <el-form label-width="100px" class='top' :inline='true'>
        <el-form-item label='销售人员名称'>
          <el-input v-model.trim='name' placeholder="请输入销售人员的名称" />
        </el-form-item>
        <el-form-item>
          <el-button style='margin-left: 20px;' @click='clearSearch'>清空</el-button>
          <el-button type='primary' @click='searchFun'>搜索</el-button>
        </el-form-item>
      </el-form>
      <!-- table -->
      <el-table ref='singleTable' class="table" :data="data" border @current-change='handleCurrentChange' 
         style='width: 100%' highlight-current-row>
         <el-table-column align='center' property='name' label='销售名称' />
      </el-table>

      <div class='u-pagination'>
        <!-- 分页 -->
        <pagination ref='page' @change='getData' :action='fetchData' :pageSize='5'></pagination>
      </div>
      <div class="btnWrap">
        <el-button type='primary' @click='confirm'>确定</el-button><el-button @click='hide'>取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import AttrSearch from '@/components/business/AttrSearch'

export default {
  name: 'u-course_detail_lessonDialog',

  components: {
    AttrSearch
  },

  data() {
    return {
      dialogVisible: false,
      data: [],
      name: '',
      currentRow: {}
    }
  },

  mounted() {
  },

  methods: {
    handleCurrentChange(val) {
      this.currentRow = val
    },

    async fetchData(aPageNum, aPageSize) {
      const params = {
        aPageNum,
        aPageSize,
        aFirmId: this.aFirmId
      }
      const name = this.name
      if (name || name === 0) params.aName = name
      return this.$api.firmGetStaffs(params)
    },

    getData(data) {
      this.data = data
    },

    show() {
      this.dialogVisible = true
      this.$nextTick(() => {
        if (this.data.length <= 0) {
          this.$refs.page.changePage()
        }
      })
    },

    clearSearch() {
      this.name = ''
      // this.$refs.attrSearch.clear()
      this.searchFun()
    },

    searchFun() {
      this.$refs.page.changePage()
    },

    hide() {
      this.dialogVisible = false
    },

    confirm() {
      this.dialogVisible = false
      this.$emit('getData', this.currentRow)
    }
  }
}
</script>

<style lang='less'>
</style>